<!-- 完善信息 -->
<template>
  <div>
    <head-nav></head-nav>
    <!-- 占位 -->
    <div class="zanwei-top"></div>
    <div class="hyts">
      <p class="hynh">亲爱的会员您好</p>
      <p class="tswz">为了更好的更新您的积分和相关权益，请完善以下信息</p>
    </div>
    <div class="perfectinput">
      <ul>
        <li>
          <mt-field v-model="userlist.name" label="您的姓名" placeholder="请输入您的姓名" type="text">
          </mt-field>
        </li>
        <li class="mint-cell-wrapper ndxb">
          <div class="title">您的性别</div>
          <div class="mint-cell-value value">
            <mt-radio v-model="userlist.sex" :options="['男', '女']">
            </mt-radio>
          </div>
          <!-- <mt-field  label="您的性别" >
             
          </mt-field> -->

        </li>
        <li>
          <mt-field v-model="userlist.birthDay" label="出生日期" placeholder="请输入您的出生日期" type="date"></mt-field>
        </li>
        <li>
          <mt-field v-model="userlist.idCard" label="身份证号码" placeholder="请输入您的身份证号码" type="text">
          </mt-field>
        </li>
        <li>
          <mt-field v-model="userlist.address" label="所在市/区" placeholder="请输入您的所在市/区" type="text">
          </mt-field>
        </li>

      </ul>
      <div class="line20"></div>
      <ul>
        <li class="yhxy">
          注册成功即视为同意
          <router-link :to="'agreement'"> 用户注册协议</router-link>
        </li>
        <li class="zcbtn">
          <mt-button type="primary" size="large" @click.native="handleClick">提交信息</mt-button>
        </li>
      </ul>

    </div>
    <!-- 城市选择器 -->
    <!-- <div>
      <transition name="fade">
        <linkage @getLinkage='_showChildMsg' v-show="showLinkage"></linkage>
      </transition>
       <p v-html="result" class="getCity" @click="_showLinkage"></p>
    </div> -->
  </div>
</template>

<script>
import { MessageBox, Toast } from "mint-ui";
// import Linkage from "./common/Address.vue";
export default {
  data() {
    return {
      yhxyvalue: "",
      userlist: {
        xfvipcode:"",
        name: "",
        sex: "男",
        birthDay: "2018-05-15",
        idCard: "",
        address: ""
      }

      //showLinkage: false, //城市选择器控制子组件的显示隐藏
      //result: "请选择所在省市",
      // id:'显示对应id'
    };
  },
  methods: {
    getcode() {
      // alert("33");
      Toast({
        message: "验证码已发送,请注意查收!",
        position: "center",
        duration: 5000
      });
    },
    handleClick() {
      if (this.userlist.name == "") {
        this.Toastfn("请输入您的姓名",2000);
      } else if (this.userlist.sex == "") {
        this.Toastfn("请输入您的性别",2000);
      } else if (this.userlist.birthDay == "") {
        this.Toastfn("请输入您的出生日期",2000);
      } else if (this.userlist.idCard == "") {
        this.Toastfn("请输入您的身份证",2000);
      } else if (this.userlist.idCard.length != 18) {
        this.Toastfn("请输入正确的身份证号码",2000);
      } else if (this.userlist.address == "") {
        this.Toastfn("请输入您的所在市/区",2000);
      } else {
        var fromdata = {
          xfvipcode:this.userlist.birthDay,
          name:this.userlist.name,
          sex:this.userlist.sex,
          birthDay:this.userlist.birthDay,
          idCard:this.userlist.idCard,
          address:this.userlist.address,
        }
        api.updateSelfInfo(this, fromdata, function(res) {
          console.log(res);
        });
        MessageBox.alert("注册成功,进入个人钱包").then(action => {
          // console.log("点击了确认");
          //跳转到钱包
          this.$router.push({ path: "/wallet" });
        });
      }
      // MessageBox({
      //   title: "提示",
      //   message: "确定执行此操作?",
      //   showCancelButton: true
      // });
      //       MessageBox.confirm('注册成功').then(action => {
      //   console.log('点击了确认');
      // })
    },
    //
    // _showChildMsg(msg) {
    //   //接收子组件数据
    //   this.result = msg.name;
    //   // this.id = msg.id;
    //   this.showLinkage = false;
    // },
    // _showLinkage() {
    //   this.showLinkage = true;
    // }


    // 提示函数
    Toastfn(message, duration, position) {
      Toast({
        message: message,
        duration: duration,
        position: position
      });
    }
  }
  // components: {
  //   Linkage //注册子组件
  // }
};
</script>

<style scoped lang="less">
.perfectinput {
  > ul:first-child {
    padding-bottom: 0.2rem;
  }
  .yhxy {
    padding: 0.25rem;
    display: flex;
    align-items: center;
    font-size: 0.28rem;
    a {
      color: #F05DC4;
    }
  }

  .zcbtn {
    padding: 0.2rem;
  }
}

.hyts {
  text-align: center;
  padding-top: 0.7rem;
  padding-bottom: 0.5rem;
  .hynh {
    font-size: 0.4rem;
    color: #F05DC4;
    font-weight: bold;
    padding-bottom: 0.2rem;
  }
  .tswz {
    font-size: 0.24rem;
  }
}
</style>